<extend name="Online/base"/>
<block name="css"><link rel="stylesheet" href="__ONLINE__/css/list.pkg.css"></block>
<block name="body">
<style type="text/css">
/* 
.g-bd ul.row-category li { width:50%; }
.g-bd .u-popup-category ul li{ height:.4rem; }
.g-bd .u-popup-category ul li a{ padding: .05rem .10rem; background:#f6f6f6; } 
*/
</style>
    <!-- 主体 -->
    <div class="g-bd">
        <ul class="row row-category">
            <li v-on:click="showZoneList" v-bind:class="{'open': zone_active, 'close': !zone_active}">
                <div>
                    <a class="text" v-text="zone_active_name"></a>
                    <a class="icon"></a>
                    <div class="clearfix"></div>
                </div>
            </li>
            <li v-on:click="showCategoryList(zone_active_id, zone_active_name)" v-bind:class="{'open': category_active, 'close': !category_active}">
                <div>
                    <a class="text" v-text="category_active_name"></a>
                    <a class="icon"></a>
                    <div class="clearfix"></div>
                </div>
            </li>
        </ul>
        <!-- 面包屑 -->

        <div class="u-popup-category" v-show="menu_show">
            <ul v-show="zone_show"  transition="move">
                <li ><h1>区域</h1></li>
                <li v-for="item in menu">
                    <a v-bind:class="{'active': item.zone_id == zone_active_id }" v-on:click="showCategoryList(item.zone_id, item.zone_name)" v-text="item.zone_name"></a>
                </li>
            </ul>

            <ul v-show="category_show" transition="move">
                <li ><h1>品类</h1></li>
                <li v-bind:class="{'active': item.category_id == category_active_id }" v-for="item in category_active_list">
                    <a v-on:click="showShopList(item.category_id, item.category_name)" v-text="item.category_name"></a>
                </li>
            </ul>

            <ul v-show="shop_show" transition="move">
                <li ><h1>店铺</h1></li>
                <li v-for="item in shop_active_list">
                    <a v-bind:href="item.shop_link" v-text="item.shop_name"></a>
                </li>
            </ul>
        </div>

        <div class="row row-goods-list">
            <h1 class="title">家博会爆款</h1>
            <ul>
				<volist name="hot_list" id="vo">
                <li>
                    <a href="{$vo.goods_link}" class="img">
                        <img  data-echo="{$vo.goods_thumb}">
                    </a>
                    <div class="info">
                        <a href="{$vo.goods_link}" class="title">{$vo.goods_name|htmlspecialchars}</a>
                        <a class="discount">{$vo.goods_discount}折</a>
                        <div class="unit">
                            <a class="surplus">剩余 {$vo.promotion_stock}</a>
                            <a href="{$vo.goods_link}" class="btn-buy">马上抢</a>
                        </div>
                        <div class="unit">
                            <span class="new-price">
                                <a>￥</a>
                                <a class="num">{$vo.shop_price}</a>
                            </span>
                            <span class="old-price">
                                <a>￥</a>
                                <a class="num">{$vo.market_price}</a>
                            </span>
                            <span class="fav">
                                <span class="icon-fav"></span>
                                <a class="num">{$vo.follow_count}</a>
                            </span>
                        </div>
                    </div>
                </li>
				</volist>
            </ul>
        </div>

    </div>
    <!-- /主体 -->
</block>
<block name="js">
<script type="text/javascript">
var menu = {$zone_category_list|default=''};
var zone_id = {$category_info.zone_id};
var zone_name = '{$category_info.zone_id|getOnlineZoneName}';
var category_id = {$category_info.online_category_id};
var category_name = '{$category_info.online_category_id|getOnlineCategoryName}';
</script>
<script type="text/javascript" src="__ONLINE__/js/list.pkg.js"></script>
</block>